<!--

  这个组件仅仅做了for循环，插槽部分的代码由父组件去完成
  插槽就是给调用者提供方便，使得子组件看起来更像是一个模板引擎

-->

<template>
  <ul>
    <li v-for="todo in todos" :key="todo.id">
      <slot :todo="todo">
      </slot>
    </li>
  </ul>
</template>

<script>
  export default {
    props: {
      todos: {
        type: Array
      }
    }
  }
</script>
